<template>
  <el-cascader
    :options="options"
    :filterable="filterable"
    v-bind="$attrs"
    v-on="$listeners"/>
</template>
<script>
import { pccApi } from '@/api/carManage/api' // 模块js引用
import store from '@/store'
export default {
  name: 'ProvinceCascader',
  props: {
    filterable: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      options: []
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.getData()
    })
  },
  methods: {
    getData() {
      const getCascaderData = (res) => {
        const cascaderData = []
        res.forEach(item => {
          const curData = {}
          const currentNode = item.currentNode
          const childrenNode = item.childrenNode
          curData.value = currentNode.code
          curData.label = currentNode.name
          if (childrenNode && childrenNode.length > 0) {
            curData.children = getCascaderData(childrenNode)
          }
          cascaderData.push(curData)
        })
        return cascaderData
      }
      const getData = _ => {
        pccApi.getValTree('provinceCode').then(res => {
          if (res.returnCode === '0000') {
            this.options = getCascaderData(res.data.tree)
            store.commit('provinceAndCity', this.options)
          }
        })
      }
      const rows = store.state.baseData['provinceAndCity']
      if (!rows || rows.length === 0) {
        getData()
      }
    }
  }
}
</script>
